var Articles = Vue.component("articles",{
    data: function () {
        articles = [];
        $.ajax({
                url:"HTTP://127.0.0.1:8080/articles",
                type : 'GET',
                dataType: 'json',
                async: false,
                success:function(res){
                    console.log('111')
                    articles = res["_embedded"]["articles"]
                }
        });
        return {
            articles: articles
        }
    },
    methods:{
        getData: function () {
            $.ajax({
                url:"HTTP://127.0.0.1:8080/articles",
                type : 'GET',
                dataType: 'json',
                async: false,
                success:function(res){
                    articles = res["_embedded"]["articles"]
                    this.articles = articles
                }
            });
        }
    },
    template: `
        <div>
            <ul>
                <li v-for="article in articles"><a :href="article.url">{{article.title}}</a></li>
            </ul>
        </div>
    `
})